<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <title>登录页</title>
    <link rel="stylesheet" href="../js/layui/css/layui.css">
    <script src="../js/layui/layui.js"></script>
    <link rel="stylesheet" href="../js/layui/css/style.css">
    <style type="text/css">
        body{background: url("../js/img/wj.png") no-repeat;background-size:cover;font-size: 16px;}
        .form{background: rgba(255,255,255,0.2);width:100px;margin:200px auto;}
        #login_form{display: block;}
        #register_form{display: none;}
        .fa{display: inline-block;top: 27px;left: 6px;position: relative;color: #ccc;}
        input[type="text"],input[type="password"]{padding-left:26px;}
        .checkbox{padding-left:21px;}

    </style>
</head>

<body>

<div class="login-main">
    <header class="layui-elip">登录</header>
    <form class="layui-form" id="loginForm">
        <center>
        <div class="layui-input-inline">
            <input type="text" name="account" required lay-verify="required" placeholder="用户名" autocomplete="off"
                   class="layui-input">
        </div>
        <div class="layui-input-inline">
            <input type="password" name="password" required lay-verify="required" placeholder="密码" autocomplete="off"
                   class="layui-input">
        </div>
        <div class="layui-input-inline login-btn">
            <button lay-submit lay-filter="login" class="layui-btn">登录</button>
            <a onclick="register()" >注册账号</a>
        </div>
        <hr/>
        </center>
    </form>
</div>

<script type="text/javascript">
    //注册
    function register() {
        location.href="../page/reg"
    }

    layui.use(['form','layer','jquery'], function () {

        // 操作对象
        var form = layui.form;
        var $ = layui.jquery;
        form.on('submit(login)',function (data) {
            $.ajax({
                url:'../web/login',
                data:data.field,
                dataType:'json',
                type:'post',
                success:function (data) {
                    if (data.code==0){
                        sessionStorage.setItem("account",data.account);
                        sessionStorage.setItem("finduserid",data.id);
                        location.href = "../page/chai";
                    }else{
                        layer.msg('登录名或密码错误');
                    }
                }
            })
            return false;
        })
    });
</script>
</body>
</html>